<template>
	<!-- 商品列表 -->
	<view class="good_box">
		<image :src="img" class="image"></image>
		<view class="content">
			<view class="both_ends">
				<view class="price_title u-line-1">
					{{name}}
				</view>
				<view class="price">
					￥{{price}}
				</view>
			</view>
		
			<u-gap height="20rpx"></u-gap>
			<view class="both_ends">
				<view class="both">
					数量：
				</view>
				<view class="ends">
					x{{num}}
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		props: {
			img: {
				type: String,
			},
			name: {
				type: String,
			},
			price: {
				type: [String,Number],
			},
			num: {
				type: [String,Number],
			},
			cost: {
				type: [String,Number],
			},
		},
		data() {
			return {
			};
		}
	}
</script>

<style lang="scss">
	.good_box {
		width: 100%;
		display: flex;
		justify-content: space-between;
	
		.image {
			border-radius: 8rpx;
			width: 124rpx;
			height: 124rpx;
			flex-shrink: 0;
			margin-right: 20rpx;
		}
	
		.content {
			width: 100%;
	
			.both_ends {
				width: 100%;
				display: flex;
				justify-content: space-between;
				color: #9D97A7;
				font-size: 26rpx;
				align-items: flex-end;
				.both {}
	
				.ends {}
				
				.price_title{
					color: #000;
					font-size: 30rpx;
				}
				.price{
					color: #999999;
					font-size: 26rpx;
				}
			}
			
		}
	
		
	}
	
	
</style>
